<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=9" />
	<meta name="description" content="Daily Parrot" /> 
	<meta name="keywords" content="daily,parrot,quotation" />
    <title>Daily Parrot Administration</title>
    <link rel="shortcut icon" href="/img/favicon.ico" />
    <link type="text/css" rel="stylesheet" href="/css/smoothness/jquery-ui-1.10.0.custom.min.css" />
    <link type="text/css" rel="stylesheet" href="/css/fullcalendar.css" />
    <link type="text/css" rel="stylesheet" href="/css/admin.css" />
    <script type="text/javascript" src="/js/jquery.1.9.0.min.js"></script>    
    <script type="text/javascript" src="/js/jquery-ui-1.10.0.custom.min.js"></script>   
    <script type="text/javascript" src="/js/fullcalendar.min.js"></script>    
    <script type="text/javascript" src="/js/admin.js"></script>
  	<script type='text/javascript'>

		$(document).ready(function() {
		
			$('#calendar').fullCalendar({

				header: {
					left: 'prev,next today',
					center: 'title',
					right: 'month,agendaWeek,agendaDay'
				},
			
				editable: true,
				
				events: "/admin/calendar",
				
				eventDrop: function(event, delta) {
					alert(event.title + ' was moved ' + delta + ' days\n' +
						'(should probably update your database)');
				},
				
				loading: function(bool) {
					if (bool) $('#loading').show();
					else $('#loading').hide();
				},

				eventClick: function(calEvent, jsEvent, view) {

			        editQuotation(calEvent);
	
			    },

				dayClick: function(date, allDay, jsEvent, view) {

					quotation = { 'id': '', 'title': '', 'picture': '', 'start': date };

					var events = $('#calendar').fullCalendar('clientEvents', function filter(event) {
							return event.start.getTime() == date.getTime();
					} );
					if (events.length == 1) {
						quotation = events[0];
					}
					
					editQuotation(quotation);
	
			    }
				
			});
			
		});

		function editQuotation(quotation) {
			var date = quotation.start.getDate() + '.' + (quotation.start.getMonth() + 1) + '.' + quotation.start.getFullYear();
			var img = '';
			$('#edit-id').attr("value", quotation.id);
			$('#edit-date').attr("value", date);
			$('#edit-content').html(quotation.title);
			if (quotation.picture) {
				img = '<img src="/show-image?id=' + quotation.picture  + '" />';
			}						
			$('#edit-pic').html(img);
			$('#editdialog').dialog({
				title: 'Spruch bearbeiten',
				width: 'auto',
				autoResize: true,
				open: function (event, ui) {
		            $('#edit-content').focus();
		        }
			});
		} 
	
	</script>
	<style type='text/css'>
	
		body {
			margin-top: 40px;
			text-align: center;
			font-size: 14px;
			font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
			}
			
		#loading {
			position: absolute;
			top: 5px;
			right: 5px;
		}
	
		#calendar {
			width: 900px;
			margin: 0 auto;
		}
		
		#calendar .fc-widget-content {
			cursor: pointer;
		}
	
	</style>
	</head>
	
	<body>
		<div id='loading' style='display:none'>...</div>
		<div id='calendar'></div>
		<div id='editdialog' style='display:none'>
			<form action="/admin/save" method="post" enctype="multipart/form-data" >
			      <input id="edit-id" type="hidden" name="id" />
		      	  <div><input id="edit-date" tabindex="-1" type="text" class="date" name="date" value="{{ quotation.day }}.{{ quotation.month }}.{{ quotation.year }}" /></div>
		      	  <div id="edit-pic">
	      		  </div>
				  <div><input type="file" class="picture" name="picture" /></div>
			      <div>
			      	<textarea id="edit-content" name="content" rows="4" cols="50"></textarea>
			      </div>
			      <div><input type="submit" value="Speichern" /></div>
			</form>
		</div>
	</body>
  
    <script type="text/javascript">

	  var _gaq = _gaq || [];
	  _gaq.push(['_setAccount', 'UA-38223339-1']);
	  _gaq.push(['_trackPageview']);
	
	  (function() {
	    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
	    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
	    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
	  })();

 </script>
 
</html>